﻿<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2006"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
	x:Class="MyFoldersExpandersControl"
	x:Name="myFoldersExpandersControl" Width="165">
    <UserControl.Resources>
        <ResourceDictionary>
            <!-- Style for the TreeViewItem controls -->
            <Style x:Key="MyTreeViewItemStyle" d:IsControlPart="True" TargetType="{x:Type TreeViewItem}">
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                <Setter Property="Padding" Value="1,0,0,0"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TreeViewItem}">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition MinWidth="19" Width="Auto"/>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition/>
                                </Grid.RowDefinitions>
                                <ToggleButton x:Name="Expander" IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
                                <Border Grid.Column="1" x:Name="Selection_Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_Header" ContentSource="Header"/>
                                </Border>
                                <ItemsPresenter Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" x:Name="ItemsHost"/>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsExpanded" Value="false">
                                    <Setter Property="Visibility" Value="Collapsed" TargetName="ItemsHost"/>
                                </Trigger>
                                <Trigger Property="HasItems" Value="false">
                                    <Setter Property="Visibility" Value="Hidden" TargetName="Expander"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" TargetName="Selection_Border"/>
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                                </Trigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="IsSelected" Value="true"/>
                                        <Condition Property="IsSelectionActive" Value="false"/>
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" TargetName="Selection_Border"/>
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                                </MultiTrigger>
                                <Trigger Property="IsEnabled" Value="false">
                                    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <!-- Style for the ToggleButton control used to expand/collapse a TreeViewItem control -->
            <Style TargetType="{x:Type ToggleButton}">
                <Setter Property="Focusable" Value="False"/>
                <Setter Property="Width" Value="19"/>
                <Setter Property="Height" Value="13"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                            <Border Width="19" Height="13" Background="#00FFFFFF" x:Name="Border">
                                <Border Width="9" Height="9" x:Name="Border1" SnapsToDevicePixels="True" BorderBrush="#FF9495A2" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1">
                                    <Border.Background>
                                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                                            <GradientStop Color="#FFFFFFFF" Offset="0.4"/>
                                            <GradientStop Color="#FFC6CEDA" Offset="1"/>
                                        </LinearGradientBrush>
                                    </Border.Background>
                                    <Path Fill="#FF000000" Margin="1,1,1,1" x:Name="ExpandPath" Data="M0,2L0,3 2,3 2,5 3,5 3,3 5,3 5,2 3,2 3,0 2,0 2,2z"/>
                                </Border>
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="True">
                                    <Setter Property="Data" Value="M0,2L0,3 5,3 5,2z" TargetName="ExpandPath"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <!-- Style for the Expander controls -->
            <Style x:Key="MyFoldersExpanderStyle" TargetType="{x:Type Expander}">
                <Setter Property="Background" Value="{DynamicResource LightBrush}"/>
                <Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type Expander}">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="*" x:Name="ContentRow"/>
                                </Grid.RowDefinitions>
                                <Border Grid.Row="0" x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2,2,0,0">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="111"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <ToggleButton Template="{DynamicResource MyToggleButtonControlTemplate}" Background="{DynamicResource NormalBrush}" IsChecked="{Binding Path=IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" OverridesDefaultStyle="True" HorizontalAlignment="Right" Margin="0,0,0,0" Width="25" BorderThickness="4,4,4,4" Grid.Column="1" Grid.ColumnSpan="1"/>
                                        <ContentPresenter Grid.Column="0" Margin="4,4,0,4" RecognizesAccessKey="True" ContentSource="Header" HorizontalAlignment="Left" Width="Auto"/>
                                    </Grid>
                                </Border>
                                <Border Visibility="Collapsed" Grid.Row="1" x:Name="ExpandSite" Background="{DynamicResource WindowBackgroundBrush}" BorderBrush="{x:Null}" BorderThickness="1,0,1,1" CornerRadius="0,0,2,2">
                                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Focusable="false"/>
                                </Border>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsExpanded" Value="True">
                                    <Setter Property="Visibility" Value="Visible" TargetName="ExpandSite"/>
                                </Trigger>
                                <Trigger Property="IsEnabled" Value="False">
                                    <Setter Property="Background" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Border"/>
                                    <Setter Property="BorderBrush" Value="{DynamicResource DisabledBorderBrush}" TargetName="Border"/>
                                    <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <!-- Control template for the ToggleButton control which is used to expand/collapse the Expander control -->
            <ControlTemplate x:Key="MyToggleButtonControlTemplate" TargetType="{x:Type ToggleButton}">
                <Grid>
                    <Rectangle Margin="0,0,0,0" x:Name="Rectangle" Fill="Transparent" Stroke="{DynamicResource NormalBorderBrush}" StrokeThickness="0"/>
                    <Path RenderTransformOrigin="0.331351646560514,0.668211636061805" Fill="{x:Null}" Stretch="Fill" Stroke="{DynamicResource MyDarkBlueSolidBrush}" Width="Auto" Height="Auto" Data="M4.3499998,4.3690003 L0.49999971,4.3690003 0.53757259,0.50000022 M6.8185094,1.9004906 L2.9685095,1.9004906 3.0060828,-1.9685095" Margin="11.033,1.358,6.648,4.304" x:Name="path">
                        <Path.RenderTransform>
                            <TransformGroup>
                                <ScaleTransform ScaleX="1" ScaleY="1"/>
                                <SkewTransform AngleX="0" AngleY="0"/>
                                <RotateTransform Angle="315"/>
                                <TranslateTransform X="0" Y="0"/>
                            </TransformGroup>
                        </Path.RenderTransform>
                    </Path>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true"/>
                    <Trigger Property="IsPressed" Value="true"/>
                    <Trigger Property="IsChecked" Value="true">
                        <Setter Property="RenderTransform" TargetName="path">
                            <Setter.Value>
                                <TransformGroup>
                                    <ScaleTransform ScaleX="1" ScaleY="1"/>
                                    <SkewTransform AngleX="0" AngleY="0"/>
                                    <RotateTransform Angle="135"/>
                                    <TranslateTransform X="0" Y="0"/>
                                </TransformGroup>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Fill" Value="{DynamicResource DisabledBackgroundBrush}" TargetName="Rectangle"/>
                        <Setter Property="Stroke" Value="{DynamicResource DisabledBorderBrush}" TargetName="Rectangle"/>
                        <Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </ResourceDictionary>
    </UserControl.Resources>

    <DockPanel LastChildFill="True" Background="Gray">
        <Expander DockPanel.Dock="Top" IsExpanded="True" Margin="0,0,0,0" Style="{DynamicResource MyFoldersExpanderStyle}" Width="Auto" Height="Auto" Header="Mail Folders" Background="{DynamicResource MyBrightBlueSolidBrush2}" BorderBrush="{DynamicResource MyDarkBlueSolidBrush}" FontSize="11" FontWeight="Bold" Foreground="{DynamicResource MyDarkBlueSolidBrush}" Grid.IsSharedSizeScope="False" ScrollViewer.CanContentScroll="False" ScrollViewer.VerticalScrollBarVisibility="Auto" x:Name="myMailExpander" BorderThickness="0,0.5,0,0" HorizontalContentAlignment="Left" VerticalContentAlignment="Stretch">
            <TreeView BorderBrush="{x:Null}" BorderThickness="0,0,0,0" x:Name="myMailTreeView" ScrollViewer.CanContentScroll="False" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Disabled" Width="163">
                <TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" Background="Transparent">
                    <TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal">
                            <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/outlookToday.bmp"/>
                            <TextBlock Margin="3,0,0,0" FontWeight="Normal" Name="MailBox">Mailbox</TextBlock>
                        </StackPanel>
                    </TreeViewItem.Header>
                    <TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/Recycle.bmp"/>
                                <TextBlock Margin="3,0,0,0" FontWeight="Normal" Name="Deleted" >Deleted </TextBlock>
                                <TextBlock Name="DeletedCount"  Margin="3,0,0,0" FontWeight="Normal" Foreground="Green"></TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    </TreeViewItem>
                    <!--<TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/drafts.bmp"/>
                                <TextBlock Margin="3,0,0,0" Name="Drafts" >Drafts</TextBlock>
                                <TextBlock Margin="3,0,0,0" FontWeight="Normal" Foreground="Green"></TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    </TreeViewItem>-->
                    <TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/inbox.bmp"/>
                                <TextBlock Margin="3,0,0,0" Name="Inbox" >Inbox</TextBlock>
                                <TextBlock Name="InboxCount"  Margin="3,0,0,0" FontWeight="Normal" Foreground="Blue"></TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    
                    </TreeViewItem>
                    <TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/outbox.bmp"/>
                                <TextBlock Margin="3,0,0,0" FontWeight="Normal" Name="Outbox">Outbox</TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    </TreeViewItem>
                    <!--<TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/junk.bmp"/>
                                <TextBlock Margin="3,0,0,0" Name="Unwantedmail">Unwanted mail</TextBlock>
                                <TextBlock Margin="3,0,0,0" FontWeight="Normal" Foreground="Green"></TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    </TreeViewItem>-->
                  
                    <TreeViewItem Style="{DynamicResource MyTreeViewItemStyle}" IsExpanded="True">
                        <TreeViewItem.Header>
                            <StackPanel Orientation="Horizontal">
                                <Image Margin="0,0,0,0" Width="16" Height="16" Stretch="Fill" Source="graphics/sent.bmp"/>
                                <TextBlock Margin="3,0,0,0" FontWeight="Normal" Name="SentItems">Sent Items</TextBlock>
                                <TextBlock Name="SentBoxCount" Margin="3,0,0,0" FontWeight="Normal" Foreground="Green"></TextBlock>
                            </StackPanel>
                        </TreeViewItem.Header>
                    </TreeViewItem>
               
                </TreeViewItem>
            </TreeView>
        </Expander>
    </DockPanel>
</UserControl>